<!DOCTYPE html>
<!--[if IE 7]>    <html class="no-js ie7 ie" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 ie" lang="en"> <![endif]-->
<!--[if IE 9]>    <html class="no-js ie9 ie" lang="en"> <![endif]-->
<!--[if gt IE 9]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
	<head>
		<meta charset="utf-8" />
		<title>扩展学习_${webName}</title>
		<meta name="description" content="" />
		<meta name="author" content="HuangBQ | ${wwwRoot}" />
		<#include "../inc/head-common.ftl">
		<#include "../inc/wysiwyg.ftl">
		<!-- jQuery TagsInput Styles -->
		<link rel='stylesheet' type='text/css' href='${cssRoot}plugins/jquery.tagsinput.css' />
		<link rel='stylesheet' type='text/css' href='${cssRoot}plugins/jquery.ui.plupload.css' />
		<link rel='stylesheet' type='text/css' href='${cssRoot}plugins/jquery.plupload.queue.css' />
		<script src="${scriptRoot}plugins/plUpload/plupload.full.js"></script>
		<script src="${scriptRoot}plugins/plUpload/jquery.plupload.queue/jquery.plupload.queue.js"></script>
	</head>
	<body>
		<#include "../inc/header.ftl">
		
		<!-- Main content -->
		<div class="container" role="main">
		
			<!-- Breadcrumbs -->
			<ul class="breadcrumb">
				<li><a href="${wwwRoot}"><span class="icon-home"></span> ${wwwName}</a></li>
				<li><a href="${webRoot}">${webName}</a></li>
				<li><a href="${webRoot}ext.do">扩展学习</a></li>
				<li class="active">扩展学习内容发布</li>
			</ul>
			<!-- Breadcrumbs -->
			
			<!-- Main data container -->
			<div class="content">
			
				<!-- Page header -->
				<div class="page-header">
					<h1><span class="icon-plus"></span> 扩展学习 <small>技术文章精选、IT职场、互联网新事...每日关注，拓展视野</small></h1>
					<ul class="page-header-actions">
						<li class="active"><a href="#typography" class="btn pull-right btn-wuxia" title="分享给朋友" target="_blank"><span class="fam-arrow-join"></span> 分享给朋友</a></li>
					</ul>
				</div>
				<!-- /Page header -->
				
				<!-- Page container -->
				<div class="page-container">
				
					<!-- Grid row -->
						<div class="row">
						  <form class="form-horizontal" id="frmAddExtension" action="${webRoot}ext/add.do" method="post"/>
							<article class="span12">
									<fieldset>
										<div class="control-group">
											<label class="control-label">标题：</label>
											<div class="controls">
											    <input type="text" name="title" id="title" class="input-xlarge"/>
												<!--p class="help-block">20字内描述你的问题</p-->
											</div>
										</div>
										<div class="control-group">
											<label class="control-label">作者：</label>
											<div class="controls">
											    <input type="text" name="author" id="author" class="input-xlarge"/>
												<!--p class="help-block">20字内描述你的问题</p-->
											</div>
										</div>
										<div class="control-group">
											<label class="control-label">来源：</label>
											<div class="controls">
											    <input type="text" name="source" id="source" class="input-xlarge"/>
												<p class="help-block">如：CSDN，大讲台</p>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label">来源地址：</label>
											<div class="controls">
											    <input type="text" name="sourceurl" id="sourceurl" class="input-xlarge"/>
												<p class="help-block">如：http://www.dajiangtai.com/1088.html</p>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="inputTag">标签：</label>
											<div class="controls">
												<input id="inputTag"  name="inputTag" class="tagsinput" type="text" value="" />
											</div>											
										</div>
										<div class="control-group">
											<label class="control-label" for="inputTag">封面图：</label>
											<div class="controls">
												<input type="hidden" name="coverimg" id="coverimg" class="input-xlarge"/>
												<a href="javascript:void(0);" class="thumbnail" style="float:left;max-width:200px;"/><img src="${uploadRoot}ext/cover/default.png" alt="封面图片" id="ext_cover_img"></a>
												<div style="float:left;margin:0 20px;"><code>更新图片>></code></div>
												<div class="plupload" style="float:left;"></div>
											</div>											
										</div>
								</article>
								<article class="span12">
										<div class="control-group">
											<label class="control-label">摘要：</label>
											<div class="controls">
												<textarea id="summary" name="summary"  placeholder="文章摘要 ..." rows="3" style="width:82%"></textarea>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label">内容：</label>
											<div class="controls">
												<textarea id="editor" name="content"  placeholder="文章内容 ..." rows="8"></textarea>
											</div>
										</div>
										<div class="form-actions">
											<button class="btn btn-primary btn-wuxia btn-large" id="addExtension" type="button">立即发布</button>
										</div>
									</fieldset>
								
							</article>
							
						 </form>
							
						</div>
						<!-- /Grid row -->
					
				</div>
				<!-- /Page container -->
				
			</div>
			<!-- /Main data container -->
			
		</div>
		<!-- /Main content -->
		
		<#include "../inc/footer.ftl">
		<!-- jQuery TagsInput -->
		<script src="${scriptRoot}plugins/tagsInput/jquery.tagsinput.min.js"></script>
		<script>
			$(document).ready(function() {
				/*初始化标签样式*/
				$('.tagsinput').tagsInput();
				/*提交表单*/
				$('#addExtension').click(function(){
				      var flag = checkForm();
				      if(flag==false){
				          $(this).pops({title:'', text:'请将内容填写完整！',type:'error',top:10, left:120, showClose : false,timeout:3000});
				         return false;
				      }  
				      document.getElementById("frmAddExtension").submit();
				});
				
			});
			/*表单地址*/
			function checkForm(){
			     var flag = true;
			     var title = $.trim($('#title').val());
			     if(title==""){
			         flag = false;
			     }
			     var author = $.trim($('#author').val());
			     if(author==""){
			         flag = false;
			     }
			     
			     var source = $.trim($('#source').val());
			     if(source==""){
			         flag = false;
			     }
			     
			     var sourceurl = $.trim($('#sourceurl').val());
			     if(sourceurl==""){
			         flag = false;
			     }
			     
			     var inputTag = $.trim($('#inputTag').val());
			     if(inputTag==""){
			         flag = false;
			     }
			     
			     var content = $.trim($('#editor').val());
			     if(content==""){
			         flag = false;
			     }
			     return flag;
			}
		</script>
		<script>
			$(document).ready(function() {
				$('.plupload').pluploadQueue({
					runtimes : 'html5,gears,flash,silverlight,browserplus',
					url : '${webRoot}ext/upload/cover.do',
					max_file_size : '10mb',
					chunk_size : '1mb',
					unique_names : true,
					resize : {width : 320, height : 240, quality : 90},
					filters : [
						{title : "Image files", extensions : "jpg,gif,png"}
					],
					flash_swf_url : '${scriptRoot}plugins/plUpload/plupload.flash.swf',
					silverlight_xap_url : '${scriptRoot}plugins/plUpload/plupload.silverlight.xap'
				});
				$(".plupload_header").remove();
				$(".plupload_progress_container").addClass("progress").addClass('progress-striped');
				$(".plupload_progress_bar").addClass("bar");
				$(".plupload_button").each(function(e){
					if($(this).hasClass("plupload_add")){
						$(this).attr("class", 'btn btn-primary btn-wuxia pl_add btn-small');
					} else {
						$(this).attr("class", 'btn btn-success btn-wuxia pl_start btn-small');
					}
				});
				var uploader = $(".plupload").pluploadQueue();//获取上传组件对象  
				uploader.bind( "FileUploaded", handlePluploadFileUploaded );//重写图片上传完毕后的处理函数
			});
			function handlePluploadFileUploaded( uploader, file, responseObject ) {  
					$("#ext_cover_img").attr("src",responseObject.response);
					$("#coverimg").val(responseObject.response);
			}
		</script>
		<script src="${scriptRoot}pops.js" type="text/javascript"></script>
</body>
</html>
